<template>
	<view>
		<uni-section title="处理入口" type="line" padding>
			<uni-grid :column="3" :show-border="false" :square="false">
				<uni-grid-item>
					<uni-badge class="uni-badge-left-margin" :text="Wdata.length" absolute="rightTop" :offset="[21, 0]"
						size="small"></uni-badge>
					<view class="grid-item-box" @click="WDistribution">
						<uni-icons type="person-filled" size="30"></uni-icons>
						<text class="text">所有工单</text>
					</view>
				</uni-grid-item>
				<uni-grid-item>
					<uni-badge class="uni-badge-left-margin" :text="StateData1.length" absolute="rightTop"
						:offset="[21, 0]" size="small">
						<!-- <view class="box"><text class="box-text">右上</text></view> -->
					</uni-badge>
					<view class="grid-item-box" @click="Whandle">
						<uni-icons type="calendar-filled" size="30"></uni-icons>
						<text class="text">未派单</text>
					</view>
				</uni-grid-item>
				<uni-grid-item>
					<uni-badge class="uni-badge-left-margin" :text="StateData2.length" absolute="rightTop"
						:offset="[21, 0]" size="small">
						<!-- <view class="box"><text class="box-text">右上</text></view> -->
					</uni-badge>
					<view class="grid-item-box" @click="handling">
						<uni-icons type="notification" size="30"></uni-icons>
						<text class="text">未处理</text>
					</view>
				</uni-grid-item>
			</uni-grid>
		</uni-section>
		<uni-section title="快速处理" type="line">
			<uni-card :is-shadow="false" padding="0" spacing="0" v-for="(item, index) in CardData">
				<!-- <view> -->
				<uni-list>
					<uni-swipe-action ref="swipeAction" style="width: 100%;">
						<uni-swipe-action-item :right-options="item.state == 1||item.state == 2 ? options1 : ''"
							:key="item.id" @change="swipeChange($event, index)" @click="swipeClick($event, item)">
							<uni-list-item :title="item.title" :note="item.createTime" link="navigateTo"
								to="/pages/work/GDsupervise/detail" showArrow clickable @click="ToDetail(item)">
								<template v-slot:footer>
									<view class="listRight">
										<uni-tag :inverted="true" :text="priorityData[item.priority - 1].text"
											:type="priorityData[item.priority - 1].type" />
										<text>{{ item.worderClass.typeName }}</text>
									</view>
								</template>
							</uni-list-item>
						</uni-swipe-action-item>
					</uni-swipe-action>
				</uni-list>
				<!-- </view> -->
			</uni-card>
		</uni-section>
		<uni-popup ref="message" type="message">
			<uni-popup-message :type="msgType" :message="messageText" :duration="2000"></uni-popup-message>
		</uni-popup>
	</view>
</template>

<script>
	import store from '@/store/index.js';
	import {
		getWorkList,
		updateState,
		remindOrder
	} from '@/api/system/user.js';
	export default {
		data() {
			return {
				//提示文本
				messageText:'',
				priorityData: [{
						text: '次要',
						value: 1,
						type: 'primary'
					},
					{
						text: '普通',
						value: 2,
						type: 'warning'
					},
					{
						text: '紧急',
						value: 3,
						type: 'error'
					}
				],
				options1: [{
					text: '催办',
					style: {
						backgroundColor: '#007aff'
					}
				}],
				cover: 'http://116.148.228.110:9000/Upload/covers/20240204/20240204_170721_7458_199%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20240204170518.png',
				cardTitle: '待派发',
				Wstate: '1',
				UserId: '',
				tableData: [],
				Wdata: '', //总数据
				StateData1: [],
				StateData2: [],
				StateData3: [],
				CardData: '',
				// 数据总量
				total: 0,
				// OrderStatus: ''
			};
		},
		onLoad() {
			this.getmyWorktodo();
			// this.getmyWorktodoList();
		},
		methods: {
			getmyWorktodoList() {
				getWorkList('1', '10000', this.Wstate).then((res) => {
					this.tableData = res.rows;
					this.total = res.total;
					this.loading = false;
				});
			},
			ToDetail(b) {
				// this.$tab.navigateTo('/pages/work/GDsupervise/detail');
				store.state.CusImform = b;
				console.log('store.state.CusImform:', store.state.CusImform);
			},
			swipeChange(e, index) {
				// console.log('返回：', e);
				// console.log('当前索引：', index);
			},
			async swipeClick(e, item) {
				let {
					content
				} = e;
				if (content.text === '催办') {
					this.editorId = item.id;
					console.log(item)
					//催办工单开发中
					remindOrder(item.id).then(res => {
							this.msgType = 'success';
							this.messageText = `催单成功!`;
							this.$refs.message.open();
						})
						.catch(err => {
							this.msgType = 'error';
							this.messageText = `催单失败!`;
							this.$refs.message.open();
						});
					/* await getallPeople(item.parentId).then((res) => {
						this.workPersonForm = res.data.map((item) => {
							return {
								value: item.userId,
								text: item.userName
							};
						});
					}); */
					// this.$refs.inputDialog.open();
				}
			},

			getmyWorktodo() {
				// try {
				// 	this.UserId = uni.getStorageSync('userID');
				// 	if (this.UserId) {
				// 		console.log(this.UserId);
				// 	}
				// } catch (e) {
				// 	// error
				// }
				const that = this;
				getWorkList('1', '10000').then((res) => {
					that.StateData1 = [];
					that.StateData2 = [];
					that.StateData3 = [];
					console.log(res.rows);
					that.Wdata = res.rows;
					that.Wdata.map((t) => {
						if (t.state == 1) {
							that.StateData1.push(t);
						}
						if (t.state == 2) {
							that.StateData2.push(t);
						}
					});
					that.CardData = that.StateData1;
					that.Wstate == 1 ? that.Whandle() : that.Wstate == 2 ? that.ChangeStatesBack() : that
						.WDistribution();
				});
			},
			WDistribution() {
				this.cardTitle = '所有工单';
				this.CardData = this.Wdata;
				// this.OrderStatus = 1
				// this.Wstate = 1;
				// this.getmyWorktodo();
			},
			Whandle() {
				this.cardTitle = '未派单';
				this.CardData = this.StateData1;
				this.Wstate = 1;
				// this.getmyWorktodo();
			},
			handling() {
				this.cardTitle = '未处理';
				this.CardData = this.StateData2;
				this.Wstate = 2;
				// this.getmyWorktodo();
			},
			ChangeStatesBack(item) {
				uni.showLoading({
					title: '加载中'
				});

				let data = {
					id: item.id,
					serviceId: item.userId,
					state: item.state - 1
				};
				console.log('data:', data);
				updateState(data).then((res) => {
					console.log('res:', res);
				});
				// console.log('data:', data);
				this.getmyWorktodo();
				uni.hideLoading({});
			},
			ChangeStatesNext(item) {
				uni.showLoading({
					title: '加载中'
				});
				let data = {
					id: item.id,
					serviceId: item.userId,
					state: item.state + 1
				};

				updateState(data).then((res) => {
					// console.log('res:', res);
				});
				// console.log('item:', item);
				// console.log('that.Wstate:', this.Wstate);
				this.getmyWorktodo();
				uni.hideLoading({});
			}
		}
	};
</script>

<style>
	.grid-item-box {
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.uni-grid {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		flex-direction: row;
	}

	.uni-list {
		flex-direction: row !important;
		align-items: center;
		height: 50px;
	}

	.btnOrder {
		height: 50%;
	}

	.listRight {
		width: 270rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
</style>